<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	    <title>我的订单</title>
	    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
	    <meta content="yes" name="apple-mobile-web-app-capable"/>
	    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
	    <meta content="telephone=no" name="format-detection"/>
		<!-- 引入核心样式 -->
		<link href="http://appimg.yinsoso.com/css/weui.min.css" rel="stylesheet">
		<link href="http://appimg.yinsoso.com/css/jquery-weui.css" rel="stylesheet">
		<link href="http://appimg.yinsoso.com/css/public.css" rel="stylesheet">
		<link href="http://appimg.yinsoso.com/css/style-min.css" rel="stylesheet">
		
	    <!--当前页面的css-->   
	    <link href="css/MeOrder.css" rel="stylesheet">
	    <!-- 引入核心JS -->
	
		<script src="http://appimg.yinsoso.com/js/vue.min.js"></script>
		<script src="http://appimg.yinsoso.com/js/3.2.0-jquery.min.js"></script>
		<script src="http://appimg.yinsoso.com/js/jquery-weui.min.js"></script>
		<script src="http://appimg.yinsoso.com/js/index.min.js"></script>
		<script src="http://appimg.yinsoso.com/js/fastclick.min.js"></script>
		<script src="http://appimg.yinsoso.com/js/common.js" type="text/javascript" ></script>
	</head>
	<body>
	  <div id="app">
		<!--tab-->
		<ul class="meorder-tabs">
			<li class="tabsLi" v-for="(item,index) in tabs" :class="{active:index+1 == type}" @click="tab(index+1)">{{item}}</li>
		</ul>
		<!--tab-->
		<div style="height: 0.3rem;width: 100%;background: #eee;"></div>
		<!--全部订单 begin-->
		<div class="meorder-list">
			<div class="lists" v-for="(item, index) in orderList" :key="index">
				<div class="list-state">
					<template v-if="item.state == 0">待支付</template>				
					<template v-if="item.state == 1">待发货</template>				
					<template v-if="item.state == 2">待收货</template>				
					<template v-if="item.state == 3">已收货</template>				
					<template v-if="item.state == 4">已取消</template>				
					<template v-if="item.state == 5">过期未支付关闭</template>				
				</div>
				<div class="list-info">
					<a class="list-info-l" @click="urlHref(item);" href="javascript:;">
						<img :src="item.head_img"/>
						<div class="list-info-title">【{{item.goods_name}}】{{item.spec}}</div>
						<div class="list-info-price">
							¥ {{item.single_price}}
							<div>×{{item.purchase_num}}</div>
						</div>
					</a>
				</div>
				<div class="meorder-price">共计{{item.purchase_num}}件商品 &nbsp;&nbsp;&nbsp;&nbsp; 合计：￥{{item.total_money}}（含运费￥{{item.express_money}}）</div>
				<div class="list-btn" v-if="item.state == 0">
					<a @click="urlHref(item);" href="javascript:;" class="cancelBtn">取消订单</a>
					<a @click="urlHref(item);" href="javascript:;" class="payBtn">立即付款</a>
				</div>
				<div class="list-btn" v-if="item.state == 2">
					<a @click="urlHref(item);" href="javascript:;" class="payBtn">立即收货</a>
				</div>
				<div style="height: 0.18rem;width: 100%;background: #eee;"></div>
			</div>
		</div>
		<div class="weui-loadmore" v-show="loading">
			<i class="weui-loading"></i>
			<span class="weui-loadmore__tips">正在加载</span>
		</div>
		<!-- <div class="nolist">暂无更多数据</div> -->
		<div class="bottom-msg" v-show="noMore">
				<div class="bottom-msg-hr"></div>
				<span class="msg-text">我是有底线的</span>
			</div>
		</div>
	  </div>
		<!--全部订单 end-->
	</body>
<script src="js/MeOrder.js"></script>
</html>
